<template>
    <div class="common-layout">
        <el-container>
            <el-main>
                <div class="all">
                    <div>
                        <img class="picture" style="vertical-align: middle" src="@/assets/bool.png">
                    </div>
                    <div class="search">
                        <el-form :inline="true" :model="formInline" class="demo-form-inline">
                            <el-form-item>
                                <el-input style="width: 400px" v-model="formInline.user" placeholder="专为疫情而生"></el-input>
                            </el-form-item>
                            <el-form-item>
                                <el-button type="primary" @click="onSubmit">搜索</el-button>
                            </el-form-item>
                        </el-form>
                    </div>
                </div>
            </el-main>
            <el-footer>
                <foot></foot>
            </el-footer>
        </el-container>
    </div>

</template>

<script>
import Foot from "@/components/Footer.vue";
export default {
    name: "MainView",
    components: {
        Foot,
    },
    data() {
        return {
            formInline: {
                user: "",
                region: "",
            },
        };
    },
    methods: {
        onSubmit() {
            console.log("submit!");
        },
    },
};
</script>

<style>
.el-container {
    height: 90vh;
}
.all {
    /* width: 300px; */
    /* height: 300px; */
    /* background-color: #eee; */
    /* border: 1px solid #ddd; */
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}
.picture {
    /* width:300px; */
    height: 230px;
}
</style>